.vf-btn {
  @apply
  inline-flex justify-center
  w-full px-4 py-2 rounded-md border shadow-sm
  text-base font-medium tracking-wide
  focus:outline-none focus:ring-2 focus:ring-offset-2
  mt-0.5 sm:mx-1 sm:w-auto sm:text-sm;
}

.vf-btn-primary {
  @apply
  border-transparent
  text-white
  bg-blue-600 hover:bg-blue-700
  focus:ring-indigo-500
  dark:text-gray-50 dark:border-gray-800 dark:bg-gray-700 dark:hover:bg-gray-500;
}

.vf-btn-primary.disabled {
  @apply
  hover:bg-blue-600
  dark:hover:bg-gray-700
}

.vf-btn-secondary {
  @apply
  border-gray-300
  text-gray-700
  bg-white hover:bg-gray-50
  focus:ring-gray-500
  dark:text-gray-300 dark:border-gray-700 dark:bg-gray-800 dark:hover:bg-gray-500;
}

.vf-btn-secondary.disabled {
  @apply
  hover:bg-gray-50
  dark:hover:bg-gray-800
}

.vf-btn-danger {
  @apply
  border-transparent
  text-white
  bg-red-600 hover:bg-red-700
  focus:ring-red-200 focus:ring-1 focus:ring-offset-1
  dark:text-gray-50 dark:border-red-800 dark:bg-red-700 dark:hover:bg-red-500;
}

.disabled {
  @apply
  opacity-50 cursor-not-allowed
}
